<template>
    
    <!-- 组件模板内容 -->
    <div class="label_cells ft16 bb_f7" @click="clickCells">
        <label  class="cl666" :style="{width:width+'px'}">{{labelcopy}}</label>
        <p class="showselecvalue cl666 tl m">{{selectvalue}}</p>
        <p class="placeholder ft16 clBBB tr" v-show="showplaceholder">{{placeholder}}</p>
        <i class="cells_right db" v-if="showrightico"></i>
    </div>
</template>

<script>
    /**
     *  引入工具类库 或 Navtive API
     *  example : import widget from 'gapi/widget'
     */

    /**
     *  引入Action
     *  example : import { someFunction } from './SomeAction'
     */
    
    /**
     *  引入Getter
     *  example : import { someFunction } from './SomeGetters'
     */

    export default {
        vuex: {
            getters: {
                
            },
            actions: {

            }
        },
        data:function(){
            return {
            }
        },
        props:['labelcopy','placeholder','cbfn','selectvalue','showplaceholder','width','showrightico'],
        methods: {
            clickCells(){
                this.$emit(this.cbfn)
            }
        },
        created (){
            
        }
    }

    
</script>

<!-- CSS 样式 -->
<!-- <style src="static/css/global.css"></style> -->
<style type="text/css">
    
    .label_cells{
        position: relative;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-left: 12px;
        padding-right: 12px;
    }
    .label_cells span{
        flex-grow: 2;
        padding-left: 32px;
    }
    .label_cells .showselecvalue{
        flex-grow:2;
        padding-left:25px;
        /*text-align: right;*/
    }
    .label_cells .placeholder{
        position: absolute;
        top: 0;
        /*right: 22px;*/
        left: 88px;
        line-height: 54px;
    }
    .label_cells:last-child{
        border-bottom: 0;
    }
    .label_cells .cells_right {
        width: 7px;
        height: 14px;
        background: url(../../static/imgs/right_cells.png) no-repeat;
        background-size: 100% 100%;
        margin-left: 12px;      

    }
</style>

